<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" href="http://cdn.webix.io/edge/webix.css" type="text/css" media="screen" charset="utf-8">
		<script src="http://cdn.webix.io/edge/webix.js" type="text/javascript" charset="utf-8"></script>
		
		<title>DHTMLX Gantt Chart in Webix Web Apps</title>
		<script type="text/javascript" src="./gantt.js"></script>
	</head>
	<body>
		<script type="text/javascript" charset="utf-8">
			webix.codebase = "./";
			
			var tasks =  {
	            data:[
	                {id:1, text:"Project #2", start_date:"01-04-2013", duration:18,order:10,
	                    progress:0.4, open: true},
	                {id:2, text:"Task #1", 	  start_date:"02-04-2013", duration:8, order:10,
	                    progress:0.6, parent:1},
	                {id:3, text:"Task #2",    start_date:"11-04-2013", duration:8, order:20,
	                    progress:0.6, parent:1}
	            ],
	            links:[
		            { id:1, source:1, target:2, type:"1"},
		            { id:2, source:2, target:3, type:"0"},
		            { id:3, source:3, target:4, type:"0"},
		            { id:4, source:2, target:5, type:"2"},
		        ]
        	};

			webix.ui({
				type:"space", rows:[
					{ 	
						view:"dhx-gantt", 
						init:function(){
							//do nothing
						},
						ready:function(){
							gantt.parse(tasks);
						}
					}
				]
			});

			

		</script>
	</body>


	
</html>